<template name="grupos">
    <h2>Consultar horarios de llegada</h2>
    <table style="width: 400px;">
        <tr>
            <th style="width: 100px;">Grupos:</th>
            <td>
                <select id="grupos" style="width:100%;">
                    <template name="grupo">
                    <option value="{{idgrupo}}">{{nombre}}</option>
                    </template>
                    <template name="no_grupos">
                    <option value="0">No hay grupos para mostrar</option>
                    </template>
                </select>
            </td>
        </tr>
        <tr>
            <th>Puntos:</th>
            <td>
                <select id="puntos" style="width:100%;">
                    <option value="0">Seleccionar punto</option>
                <template name="ruta_open">
                    <optgroup label="{{nombre_ruta}}">
                </template>
                <template name="ruta_close">
                    </optgroup>
                </template>
                <template name="punto">
                    <option value="{{idpunto_por_ruta}}">{{nombre_ruta}} - {{nombre}}</option>
                </template>
                <template name="no_puntos">
                    <option value="0">No hay puntos para mostrar</option>
                </template>
                </select>
            </td>
        </tr>
    </table>
    <br/>
    <table style="width: 700px;" id="horario_table">
        <tr>
            <th></th>
            <th>Horario</th>
            <th>Tiempo</th>
            <th>Veh&iacute;culo</th>
            <th>Patente</th>
            <th>Conductor</th>
        </tr>
        <tr id="cargando" style="display:none">
            <td colspan="6">Cargando informaci&oacute;n...</td>
        </tr>
        <tr id="foo_horario" style="display:none">
            <td style="width:31px" class="horario_img"></td>
            <td class="horario_hora"></td>
            <td class="horario_tiempo"></td>
            <td class="horario_vehiculo"></td>
            <td class="horario_patente"></td>
            <td class="horario_conductor"></td>
        </tr>
    </table>
    <script type="text/javascript" src="/js/consulta.js"></script>
    <script type="text/javascript">
        var timeDiff = {{server_time}} - Math.round(new Date().getTime()/1000.0);
        $(function(){
            consulta.init('{{link_grupos}}', '{{link_puntos}}', '{{link_tiempos}}');
            consulta.setTimeDiff(timeDiff);
        });
    </script>
</template>